<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <ul id="list">
  </ul>
  <script>
      const arr = [
          {name: "小明", age: 12, sex: "男"},
          {name: "小红", age: 11, sex: "女"},
          {name: "小强", age: 13, sex: "男"},
      ];

      const list = document.querySelector('#list');

      arr.forEach(people => {
          const str = `
            <li>
                <div class="hd">${people.name}的基本信息</div>
                <div class="bd">
                    <p>姓名：${people.name}</p>
                    <p>年龄：${people.age}</p>
                    <p>性别：${people.sex}</p>
                </div>
            </li>
          `;

          list.innerHTML += str;
      });
  </script>
</body>
</html>